<template>
  <div class="hold-transition">
    <div class="content-header">
      <h1>
        统计分析
        <small>套餐占比</small>
      </h1>
      <el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
        <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>统计分析</el-breadcrumb-item>
        <el-breadcrumb-item>套餐占比</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="app-container">

       <el-date-picker
      v-model="value1"
      type="monthrange"
      range-separator="至"
      start-placeholder="开始月份"
      end-placeholder="结束月份"
      :pickerOption=pickerOptions>
    </el-date-picker>
    
      <div class="box"> 
        <div id="chart1" style="height:600px;">
          
        </div>


      </div>

      
    </div>



  </div>




  
</template>






<script>
  export default {
    data() {
      return {
        pickerOptions: {  
          shortcuts: [{
            text: '本月',
            onClick(picker) {
              picker.$emit('pick', [new Date(), new Date()]);
              console.log(picker.$emit('pick', [new Date(), new Date()]))
            }
          }
          ]
        },
        value1: '',
       
      };
    }
  }
  ;
</script>    
    


